<%@ page language="java" contentType="text/html;charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<%@ include file="../common/header.jsp"%>
</head>
<body>

	<div class="container " style="margin-top: 20px">
		<%@ include file="../common/top.jsp"%>

		<div class="row">
			<div class="col-sm-3">

				<c:set var="menu" value="role" />
				<%@ include file="../common/menu.jsp"%>
			</div>
			<div class="col-sm-9">
				<div class="row">
					<div class="col-sm-12">
						<h1 class="page-head-line">角色编辑</h1>
					</div>
				</div>
				<div class="row col-sm-10">
					<form class="form-horizontal" action="/role/saveOrUpdate.do"
						method="post" id="editForm">
						<input type="hidden" name="id" value="${entity.id}">
						<div class="form-group">
							<label class="col-sm-2 control-label">角色名称：</label>
							<div class="col-sm-6">
								<input type="text" class="form-control" name="name"
									value="${entity.name}" placeholder="请输入角色名称">
							</div>
						</div>
						<div class="form-group">
							<label class="col-sm-2 control-label">角色编码：</label>
							<div class="col-sm-6">
								<input type="text" class="form-control" name="sn"
									value="${entity.sn}" placeholder="请输入角色编码">
							</div>
						</div>
						<div class="form-group" id="role">
							<div>
								<label for="role" class="control-label"
									style="margin-left: 60px">权限：</label>
							</div>
							<div class="row" style="margin-top: 10px">
								<div class="col-sm-4 col-sm-offset-1">
									<select multiple class="form-control allPermissions" size="15">
										<c:forEach var="p" items="${notSelected}">
											<option value="${p.id}">${p.name}</option>
										</c:forEach>
									</select>
								</div>
								<div class="col-sm-2" style="margin-top: 60px;" align="center">
									<div>
										<a type="button" class="btn btn-info  "
											style="margin-top: 10px"
											onclick="moveSelected('allPermissions', 'selfPermissions')">&nbsp;&gt;&nbsp;</a>
										<br> <a type="button" class="btn btn-info "
											style="margin-top: 10px"
											onclick="moveSelected('selfPermissions', 'allPermissions')">&nbsp;&lt;&nbsp;</a>
										<br> <a type="button" class="btn btn-info "
											style="margin-top: 10px"
											onclick="moveAll('allPermissions', 'selfPermissions')">&gt;&gt;</a>
										<br> <a type="button" class="btn btn-info "
											style="margin-top: 10px"
											onclick="moveAll('selfPermissions', 'allPermissions')">&lt;&lt;</a>
									</div>
								</div>

								<div class="col-sm-4">
									<select multiple class="form-control selfPermissions" size="15"
										name="ids">
										<c:forEach var="p" items="${selected}">

											<option value="${p.id}">${p.name}</option>
										</c:forEach>

										<%--  <c:if test="${not empty entity}" >
                                    <c:forEach var="p" items="${permissions}" >
                                        
                                            <option value="${p.id}">${p.name}</option>
                                        </c:forEach>
                                        </c:if>
 --%>
									</select>
								</div>
							</div>
						</div>
						<div class="form-group">
							<div class="col-sm-offset-1 col-sm-6">
								<button id="btn_submit" type="button" class="btn btn-default">保存</button>
								<button type="reset" class="btn btn-default">重置</button>
							</div>
						</div>
					</form>
				</div>
			</div>
		</div>
	</div>
	<script>
		//列表移动
		function moveSelected(src, target) {
			$("." + src + " option:selected").appendTo("." + target);
		}

		function moveAll(src, target) {
			$("." + src + " option").appendTo("." + target);
		}

		$(function() {
			//提交表单
			$("#btn_submit").click(function() {
				//选中右边所有的option
				$(".selfPermissions option").prop("selected", true);
				//提交表单
				$("#editForm").submit();
			});

			//选项去重
			$.each($(".selfPermissions option"),
					function(index, ele) {
						$(".allPermissions option[value='" + ele.value + "']")
								.remove();
					});
		});
	</script>
</body>
</html>